<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>心跳</title>
	<style type="text/css">
	.big{ 
		width: 250px;height: 250px;
		position: relative;
		margin-left: auto;
		margin-right: auto;
	}
	.left{
		width: 100px;height: 100px;
		border-radius: 50%;
		background-color: red;
		position: absolute;
		top:30px;
		left:30px;
		animation:myfirst 2s infinite;
	}
	.right{
		width: 100px;height: 100px;
		border-radius: 50%;
		position: absolute;
		top:30px;
		background-color: red;
		left:110px;	
		animation:myfirst 2s infinite;	
	}
	.buttom{
		width: 100px;height: 100px;
		position: absolute;
		background: red;
		top: 69px;
		left: 68.5px;
		transform:rotate(46.5deg);
		animation:myfirst 2s infinite; 
	}
	@keyframes myfirst{
    0%   {width: 120px;height: 120px;}
    50%  {width: 100px;height: 100px;}
    100% {width: 120px;height: 120px;}
    }
	</style>
</head>
<body>
<div class="big">
	<div class="left"></div>
	<div class="right"></div>
	<div class="buttom"></div>
</div>
</body>
</html>